<!-- 规模组件的封装 -->
<template>
  <el-select placeholder="请选择规模" v-model="currentValue" :popper-append-to-body="false">
    <el-option v-for="(item,index) in optionList" :key="index" :label="item.name" :value="item.val">
    </el-option>
  </el-select>
  <!-- 父组件调用 -->
  <!-- <GMSelect :value="query.scale" @parentEvent="getGMChild" ref="GMDome"></GMSelect> -->
</template>
<script>
import { getScale } from '@/api/index';
export default {
  name: 'gm-select',
  props: {
    value: {
      type: [String, Number]
    }
  },
  // props: ['value'],
  data () {
    return {
      optionList: [],
      currentValue: this.value
    }
  },
  computed: {},
  created () {
    // console.log(this.optionValue, '传过来的值事实上')
  },
  mounted () {
    this.getOptionList();
  },
  watch: {
    value (newVal) {
      this.currentValue = newVal;
    },
    currentValue (newVal, oldVal) {
      if (newVal !== oldVal) {
        // 子组件通过$$emit 给父组件派发事件
        this.$emit('parentEvent', this.currentValue)
      }
    }
  },
  methods: {
    /**
     * 获取闺蜜的下拉数据
     */
    getOptionList () {
      // this.optionList = [
      //   { cValue: 1, cName: '20人以下' },
      //   { cValue: 2, cName: '20-99人' },
      //   { cValue: 3, cName: '100-499人' },
      //   { cValue: 4, cName: '500-999人' },
      //   { cValue: 5, cName: '1000-9999人' },
      //   { cValue: 6, cName: '10000人以上' }
      // ]
      getScale().then(res => {
        if (res.success) {
          this.optionList = res.data;
        } else {
          this.$message.error(`${res.msg}`)
        }
      })
    },
    /**
    * 清空内容
    */
    clearContent () {
      this.currentValue = '';
    }
  }
}
</script>
<style scoped>
</style>